<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
	
	<p:dialog id="popUpNuevoDocente" header="#{i18n['erp.matricula.docente.registrar']}" resizable="false" draggable="false"
		widgetVar="dlgNuevoDocente" modal="true" width="560" minWidth="560" appendTo="@(body)">
		
		<h:form id="formNuevoDocente" styleClass="formulario">
		
			<p:panel id="pnlNuevoDocente">
			
				<table class="formulario">
					<tr>
						<td width="100%" colspan="4"><p:graphicImage id="image" height="80" cache="false" value="#{docenteDataManager.personaInstancia.perFoto}"/></td>
					</tr>
				
					<tr>
						<td class="label">
							<h:outputLabel for="txtCi" value="#{i18n['erp.matricula.docente.cedula']}" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
						<td class="value">
							<p:inputText id="txtCi"  value="#{docenteDataManager.personaInstancia.perCi}" maxlength="10" 
								required="true"  requiredMessage="El campo #{i18n['erp.matricula.docente.cedula']} es Obligatorio."
								label="#{i18n['erp.matricula.docente.cedula']}"
								onkeypress="return isNumberKey(event);"
								>
								<f:validateLength maximum="10" minimum="10"/>
								<f:validator validatorId="ec.edu.uce.erp.web.validador.CedulaValidator" />
							</p:inputText>
						</td>
						<td class="label">
							<h:outputLabel  value="Género" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
					<td  class="value"><p:selectOneRadio 
										required="true"
										requiredMessage="El campo Género es Obligatorio."
										value="#{docenteDataManager.personaInstancia.perGenero}">
										<f:selectItem itemLabel="Femenino" itemValue="F" />
										<f:selectItem itemLabel="Masculino" itemValue="M" />
									</p:selectOneRadio></td>
						
					</tr>	
							
					<tr>
						
						<td class="label" >
							<h:outputLabel for="txtNombres" value="#{i18n['erp.matricula.docente.nombres']}" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
							
						</td>
						<td class="value" colspan="3">
							<p:inputText id="txtNombres"  value="#{docenteDataManager.personaInstancia.perNombres}"
								style="width: 100%"
								required="true" 
								requiredMessage="El campo #{i18n['erp.matricula.docente.nombres']} es Obligatorio."
								label="#{i18n['erp.matricula.docente.nombres']}"/>
						</td>
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel for="txtApe" value="#{i18n['erp.matricula.docente.apellidos']}" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
						<td class="value" colspan="3"> 
							<p:inputText id="txtApe" style="width: 100%" 
							required="true"
							requiredMessage="El campo #{i18n['erp.matricula.docente.apellidos']} es Obligatorio."
							 value="#{docenteDataManager.personaInstancia.perApellidos}"
								 />
						</td>
						
					</tr>
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtFecNac" value="Fecha Nac." />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
						<td class="value">
							<p:calendar id="txtFecNac" style="width: 100%"  value="#{docenteDataManager.personaInstancia.perFechaNac}" 
								showOn="button" required="true" navigator="true"
								requiredMessage="El campo Fecha Nacimiento es Obligatorio."/>
						</td>	
					</tr>
					
					
					<tr>
						<td class="label">
							<h:outputLabel for="txtTelefono" value="#{i18n['erp.matricula.docente.telefono']}" />
						</td>
						<td class="value">
							<p:inputText id="txtTelefono"  value="#{docenteDataManager.personaInstancia.perTelefono}"
								onkeypress="return isNumberKey(event)" />
						</td>	
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel for="txtCelular" value="#{i18n['erp.matricula.docente.celular']}" />
						</td>
						<td class="value">
							<p:inputText id="txtCelular"  value="#{docenteDataManager.personaInstancia.perCelular}" onkeypress="return isNumberKey(event)"
								 />
						</td>	
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel for="txtEmail" value="#{i18n['erp.matricula.docente.email']}" />
						</td>
						<td class="value" colspan="3">
							<p:inputText id="txtEmail" style="width: 100%" value="#{docenteDataManager.personaInstancia.perEmail}">
								 <f:validator validatorId="ec.edu.uce.erp.web.validador.EmailValidator" />
						</p:inputText>
						</td>	
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel for="txtDir" value="#{i18n['erp.matricula.docente.direccion']}" />
							<h:outputLabel value="#{i18n['label.signo.requerido']}"
								styleClass="item-required" />
						</td>
						<td class="value" colspan="3">
							<p:inputTextarea id="txtDir" style="width: 100%" autoResize="false"  value="#{docenteDataManager.personaInstancia.perDireccion}"
							required="true" 
							requiredMessage="El campo #{i18n['erp.matricula.docente.direccion']} es Obligatorio."
							/>
						</td>	
					</tr>
					<tr>
						<td class="label">
							<h:outputLabel value="Foto Docente" />
						</td>
						<td class="value">
						<table>
						<tr>
						<td>
						<p:fileUpload fileUploadListener="#{docenteController.handleFileUpload}" mode="advanced" dragDropSupport="true"
                     				 update="formNuevoDocente:image" auto="true" sizeLimit="1000000" allowTypes="/(\.|\/)(gif|jpe?g|png)$/" label="Seleccionar" process="@this"/>
						</td>
						</tr>
						</table>
											</td>
					</tr>
					
					
				</table>
			</p:panel>
			<p:panel id="pnlBotones">
				<p:commandButton id="btnGuardar" value="#{i18n['label.guardar']}"
				    icon="ui-icon-disk"
					actionListener="#{docenteController.registrarDocente()}"
					oncomplete="if (args &amp;&amp; !args.validationFailed) dlgNuevoDocente.hide()"
					process="@this,pnlNuevoDocente" update="pnlNuevoDocente,:formDocente:pnlMessages,:formDocente:tablaDocente"/>
				<p:commandButton 
				    icon="ui-icon ui-icon-circle-close"
				    value="#{i18n['label.cancelar']}"
				    onclick="dlgNuevoDocente.hide();" 
				    actionListener="#{docenteController.cancel}" 
				    type="button" />
			</p:panel>
		</h:form>
	</p:dialog>
	
</ui:composition>